<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<link type="text/css" rel="stylesheet" href="css/admin.css" />
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-1.11.0.min.js"></script>
<link type="text/css" rel="stylesheet" href="${pageContext.request.contextPath }/css/admin.css" />
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath }/css/jquery-ui.css" />
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-ui-1.10.4.custom.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery.ui.datepicker-zh-CN.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-ui-timepicker-addon.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath }/js/jquery-ui-timepicker-zh-CN.js"></script>
<style type="text/css">
	.main{
		margin: 0px 0px 30px 0px;
	    padding: 0px 0px 0px 0px;
		background:#FFFFFF;	
	    font-family:Arial, Helvetica, sans-serif;
		font-size: 12px;
		line-height: 150%;
		color:#000000;   /*#666666*/
		text-align:center;
		vertical-align:top;
	}
	.tab{
		width:auto;
		height:auto;
		margin: 0px auto;
	}
	.tab td{
		border: 1px #cccccc solid;
	}
	.like{
		margin-left:40%;
		margin-top: 50px;
	}
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { float: left; clear:left; padding: 0 0 0 5px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 45%; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

.ui-timepicker-rtl{ direction: rtl; }
.ui-timepicker-rtl dl { text-align: right; padding: 0 5px 0 0; }
.ui-timepicker-rtl dl dt{ float: right; clear: right; }
.ui-timepicker-rtl dl dd { margin: 0 45% 10px 10px; }
</style>
</head>
<body>
	<div class="main">
		<table class="tab">
			<tr>
				<td>学生头像</td>
				<td>学生姓名</td>
				<td>学生性别</td>
				<td>学生体重</td>
				<td>学生生日</td>
				<td>所在班级</td>
				<td>操作</td>
			</tr>
			<c:forEach items="${pageUtils.rows }" var="i">
				<tr>
					<td>
						<img src="/StuSystem/img/${i.head}">
					</td>
					<td>
						${i.sname }
					</td>
					<td>
						${i.sex }
					</td>
					<td>
						<fmt:formatNumber value="${i.weight }" pattern="0.00"/>
					</td>
					<td>
						<fmt:formatDate value="${i.birth }" pattern="yyyy-MM-dd" />
					</td>
					<td>
					
						${i.cla.cname }
					</td>
					<td>
						<a href="javaScript:void(0)"  name="${i.id }">修改一</a><br/>
						<a href="javaScript:void(0)" name="${i.id }">修改二</a><br/>
						<a href="javaScript:void(0)" name="${i.id }">删除</a><br/>
						
					</td>
				</tr>
				
			</c:forEach>
			<script>
				$(function(){
					$("a:contains(修改一)").click(function(){
						var id = $(this).attr("name");
						location.href="${pageContext.request.contextPath }/getStuById.action?id="+id;
					});
					$("a:contains(修改二)").click(function(){
						
					});
					$("a:contains(删除)").click(function(){
						var id = $(this).attr("name");
						location.href="${pageContext.request.contextPath }/deleteStu.action?id="+id;
					});
				});			
			</script>
			<tr>
				<td>
					<a href="javaScript:void(0)">首页</a>
				</td>
				<td></td>
				<td>
					<a href="javaScript:void(0)">上一页</a>
				</td>
				<td></td>
				<td>
					<a href="javaScript:void(0)">下一页</a>
				</td>
				<td></td>
				<td>
					<a href="javaScript:void(0)">尾页</a>
				</td>
			</tr>
		</table>
		<div>
			<a href="${pageContext.request.contextPath }/getStuListByPage.action?pageindex=1">查询所有</a>&nbsp;&nbsp;&nbsp;
			<span>第${pageUtils.pageindex }/${pageUtils.pagecount }页</span>
			<a href="${pageContext.request.contextPath }/claRegister.jsp">添加班级</a>
			<a href="${pageContext.request.contextPath }/getAllCla.action">添加学生</a>
		</div>
		
		<script >
		$(function(){
			$("a:contains(首页)").click(function(){
				$("#likeForm").prop("action","${pageContext.request.contextPath }/getStuByLike.action?pageindex=1");
				$("#likeForm").submit();
			});
			$("a:contains(尾页)").click(function(){
				$("#likeForm").prop("action","${pageContext.request.contextPath }/getStuByLike.action?pageindex=${pageUtils.pagecount }");
				$("#likeForm").submit();
			});
			$("a:contains(上一页)").click(function(){
				$("#likeForm").prop("action","${pageContext.request.contextPath }/getStuByLike.action?pageindex=${pageUtils.pageindex-1<1?pageUtils.pageindex:pageUtils.pageindex-1 }");
				$("#likeForm").submit();
			});
			$("a:contains(下一页)").click(function(){
				$("#likeForm").prop("action","${pageContext.request.contextPath }/getStuByLike.action?pageindex=${pageUtils.pageindex+1>pageUtils.pagecount?pageUtils.pageindex:pageUtils.pageindex+1 }");
				$("#likeForm").submit();
			});
		});		
		</script>
		
		
		
		<div class="like">
			<form id="likeForm" action="${pageContext.request.contextPath }/getStuByLike.action?pageindex=1" method="post"  >
				<table>
				<tr>
					<td>姓名</td>
					
					<td>
					
					<input type="text" name="sname" value="${svo.sname }"></td>
				</tr>
				<tr>
					<td>性别</td>
					<td>
						<label>
							男<input type="radio" name="sex" value="男">
						</label>
						<label>
							女<input type="radio" name="sex" value="女">
						</label>
						<script>
							$(function(){
								$("input[name='sex']").each(function(){
									if($(this).val() == "${svo.sex}"){
										$(this).prop( "checked", true );
									}
								});
							});	
						</script>
					</td>
				</tr>
				<tr>
					<td>体重</td>
					<td><input type="text" name="weight"  value="${svo.weight }"></td>
				</tr>
				<tr>
					<td>生日</td>
					<td>
						<input name="birth" type="text" class="text-box" 
						value='<fmt:formatDate value="${svo.birth }" pattern="yyyy-MM-dd" />' placeholder="生日" title="生日" 
						readonly="readonly" style="cursor:pointer;"/>
						<input name="birth2" type="text" class="text-box" 
						value='<fmt:formatDate value="${svo.birth2 }" pattern="yyyy-MM-dd" />' placeholder="生日" title="生日" 
						readonly="readonly" style="cursor:pointer;"/>
					</td>
					<script type="text/javascript">
						$( "input[name='birth'],input[name='birth2']" ).datetimepicker();
					</script>
				</tr>
				<tr>
					<td></td>
					<td><input type="submit" value="查询"></td>
				</tr>
			</table>
			</form>
		</div>
	</div>
</body>
</html>